<%@page import="br.ufc.apsoo.models.Despesa"%>
<jsp:include page="../template/top.jsp"></jsp:include>

	<form action="${pageContext.request.contextPath}/reserva/confirma/checkout" method="post">
	
		<div class="interfaceExterna">
			<h3><a href="#">Reserva</a></h3>
			<div>
			
				<input type="hidden" name="reserva.id" value="${reserva.id}" />
				
				<div class="campo">
					<label>Tipo do Apartamento</label>
					<input type="text" name="reserva.apartamento.tipoApartamento.nome" value="${reserva.apartamento.tipoApartamento.nome}" readonly="readonly"/>
				</div>
				
				<div class="campo">
					<label>N&uacute;mero</label>
					<input type="text" name="reserva.apartamento.numero" value="${reserva.apartamento.numero}" readonly="readonly"/>
				</div>
				
				<div class="campo">
					<label>Data de Entrada</label>
					<input type="text" id="dataEntrada" name="reserva.dataEntrada"
							value="<fmt:formatDate value='${reserva.dataEntrada}' pattern='dd/MM/yyyy' />" readonly="readonly"/>
				</div>
				
				<div class="campo">
					<label>Data de Sa&iacute;da</label>
					<input type="text" id="dataSaida" name="reserva.dataSaida"
							value="<fmt:formatDate value='${reserva.dataSaida}' pattern='dd/MM/yyyy' />" readonly="readonly"/>
				</div>
			
			</div>
		
		</div>
		
		<br clear="all"/>
		
		<div class="interfaceExterna">
			<h3><a href="#">H&oacute;spede</a></h3>
			<div>
				<input type="hidden" name="reserva.hospede.id" value="${reserva.hospede.id}" />
			
				<div class="campo">
					<label>Nome</label>
					<input type="text" name="reserva.hospede.nome" value="${reserva.hospede.nome}" readonly="readonly"/>
				</div>
				
				<div class="campo">
					<label>CPF</label>
					<input type="text" name="reserva.hospede.cpf" value="${reserva.hospede.cpf}" alt="cpf" readonly="readonly"/>
				</div>
			</div>
		</div>
		
		<br clear="all"/>
		
		<div class="interfaceExterna">
			<h3><a href="#">Despesas</a></h3>
			
			<div>
			<table>
				<thead>
					<tr>
						<th width="200px" align="left">Data</th>
						<th width="300px" align="left">Servi&ccedil;o</th>
						<th width="200px" align="left">Quantidade</th>
						<th width="200px" align="left">Valor Unit&aacute;rio</th>
						<th width="200px" align="left">Valor Total</th>
					</tr>
				</thead>
				
				<tbody>
					<c:if test="${not empty despesas}">
						<c:forEach var="despesa"  items="${despesas}">
							<c:if test="${despesa.estornada}">
								<tr style="color: red;">
							</c:if>
							<c:if test="${not despesa.estornada}">
								<tr>
							</c:if>
							
								<td width="200px" align="left"> <fmt:formatDate value="${despesa.data}" pattern="dd/MM/yyyy"/> </td>
								<td width="300px" align="left"> ${despesa.servico.descricao} </td>
								<td width="200px" align="left"> ${despesa.quantidade} </td>
								<td width="200px" align="left"> <fmt:formatNumber currencySymbol="R$ "
									type="currency" value="${despesa.servico.valor}" /></td>
								<td width="200px" align="left"> <fmt:formatNumber currencySymbol="R$ "
									type="currency" value="${despesa.servico.valor * despesa.quantidade}" /></td>
							</tr>
						</c:forEach>
					</c:if>
					<c:if test="${empty despesas}">
						<tr>
							<td colspan="5">Nenhuma despesa encontrada!</td>
						</tr>
					</c:if>
				</tbody>
			</table>
			
			<br clear="all"/>
			<br clear="all"/>
			
			<table>
				<thead>
					<tr>
						<th width="200px" align="left"></th>
						<th width="300px" align="left"></th>
						<th width="200px" align="left"></th>
						<th width="200px" align="left"></th>
						<th width="200px" align="left"></th>
					</tr>
				</thead>
				
				<tbody>
					<tr>
						<td width="200px" align="left"></td>
						<td width="300px" align="left"></td>
						<td width="200px" align="left"></td>
						<td width="200px" align="left" style="font-weight: bold;">Total de Despesas</td>
						<td width="200px" align="left"> <fmt:formatNumber currencySymbol="R$ "
									type="currency" value="${reserva.valorTotalDeDespesas}" /> </td>
					</tr>
					
					<tr>
						<td width="200px" align="left"></td>
						<td width="300px" align="left"></td>
						<td width="200px" align="left"></td>
						<td width="200px" align="left" style="font-weight: bold;">Total de Di&aacute;rias</td>
						<td width="200px" align="left"> <fmt:formatNumber currencySymbol="R$ "
									type="currency" value="${reserva.valorTotalDeDiarias}" /> </td>
					</tr>
					
					<tr>
						<td width="200px" align="left"></td>
						<td width="300px" align="left"></td>
						<td width="200px" align="left"></td>
						<td width="200px" align="left" style="font-weight: bold;">Total Geral</td>
						<td width="200px" align="left"> <fmt:formatNumber currencySymbol="R$ "
									type="currency" value="${reserva.valorTotalDeDiarias + totalDespesas}" /> </td>
					</tr>
				</tbody>
			</table>
		</div>
		
		</div>
		
		<br clear="all"/>
		
		<div class="botoes">
			<input type="submit" value="Check-out" id="botaoSalvar"/>
			<a href="${pageContext.request.contextPath}/reserva/lista" id="botaoVoltar">Voltar</a>
		</div>
		
	</form>

<jsp:include page="../template/bottom.jsp"></jsp:include>